<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--
  1. 模板   -- template
       结构

-->
<div id="app">
    {{message}}
    <select>
        <option  v-for="city in cities"  :value="city.id">{{ city.name }}</option>
    </select>
</div>
</body>
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>

<!--2.vue实例 -->
<script>

    /**
     * var app = document.getElementById('app');
     * app.innerText = 'hello world'
    * */

    /**vue 实例*/
   var app=  Vue.createApp({
         data:function (){
             return {
                  message:'hello world',  // 数据
                  cities:[
                      {
                          id:1,
                          name:'北京'
                      },{
                          id:2,
                          name:'天津'
                      }
                  ]
             }
         }
     });

   app.mount('#app')

</script>

</html>